<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Bootstrap Dashboard</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="all,follow">
    <link href="https://cdn.bootcss.com/twitter-bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.bootcss.com/font-awesome/5.13.0/css/all.min.css" rel="stylesheet">
    <link rel="stylesheet" href="/static/vendor/css/fontastic.css">
    <link rel="stylesheet" href="/static/vendor/css/style.default.css" rel="stylesheet">
    <link rel="stylesheet" href="/static/vendor/css/custom.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/jquery/3.5.0/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/twitter-bootstrap/4.4.1/js/bootstrap.min.js"></script>
    <link rel="shortcut icon" href="/static/vendor/img/favicon.ico">
    <script src="/static/vendor/js/render.js"></script>
</head>
<body>
<!-- Side Navbar -->
<nav class="side-navbar">
    <div class="side-navbar-wrapper">
        <!-- Sidebar Header    -->
        <div class="sidenav-header d-flex align-items-center justify-content-center">
            <!-- User Info-->
            <div class="sidenav-header-inner text-center"><img
                        src="https://file.oreorigin.com/d4810653bff615a839283c91039f4589.png" alt="person"
                        class="img-fluid rounded-circle">
                <h2 class="h5">Tung Yao</h2><span>Web Architect</span>
            </div>
            <!-- Small Brand information, appears on minimized sidebar-->
            <div class="sidenav-header-logo"><a href="index.html" class="brand-small text-center">
                    <strong>B</strong><strong class="text-primary">D</strong></a></div>
        </div>
        <!-- Sidebar Navigation Menus-->
        <div class="main-menu">
            <h5 class="sidenav-heading">Main</h5>
            <ul id="side-main-menu" class="side-menu list-unstyled">
                <li><a href="/manager/page/index"> <i class="icon-home"></i>Home </a></li>
                <li><a href="/manager/page/article"> <i class="icon-form"></i>Article </a></li>
                <li><a href="/manager/page/category"> <i class="fa fa-book"></i>category </a></li>
                <li><a href="/manager/page/write"> <i class="fa fa-book"></i>Write </a></li>
            </ul>
        </div>
    </div>
</nav>
<div class="page">
    <!-- navbar-->
    <header class="header">
        <nav class="navbar">
            <div class="container-fluid">
                <div class="navbar-holder d-flex align-items-center justify-content-between">
                    <div class="navbar-header"><a id="toggle-btn" href="#" class="menu-btn"><i
                                    class="icon-bars"> </i></a><a href="index.html" class="navbar-brand">
                            <div class="brand-text d-none d-md-inline-block"><span>Bootstrap </span><strong
                                        class="text-primary">Dashboard</strong></div>
                        </a></div>
                    <ul class="nav-menu list-unstyled d-flex flex-md-row align-items-md-center">
                        <li class="nav-item"><a href="/manager/user/out" class="nav-link logout"> <span
                                        class="d-none d-sm-inline-block">Logout</span><i
                                        class="fa fa-sign-out"></i></a></li>
                    </ul>
                </div>
            </div>
        </nav>
    </header>
    <!-- Counts Section -->
    <section class="dashboard-counts section-padding">
        <div class="container-fluid">
            <div class="row data_column">
                <div class="col-xl-2 col-md-4 col-6">
                    <div class="wrapper count-title d-flex">
                        <div class="icon"><i class="icon-user"></i></div>
                        <div class="name"><strong class="text-uppercase">Yesterday
                                Clients</strong><span></span>
                            <div class="count-number">{{item.yesterday}}</div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-2 col-md-4 col-6">
                    <div class="wrapper count-title d-flex">
                        <div class="icon"><i class="icon-user"></i></div>
                        <div class="name"><strong class="text-uppercase">Today
                                Clients</strong><span></span>
                            <div class="count-number">{{item.today}}</div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-2 col-md-4 col-6">
                    <div class="wrapper count-title d-flex">
                        <div class="icon"><i class="icon-list-1"></i></div>
                        <div class="name"><strong class="text-uppercase">All Articles</strong><span></span>
                            <div class="count-number">{{item.all_articles}}</div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-2 col-md-4 col-6">
                    <div class="wrapper count-title d-flex">
                        <div class="icon"><i class="icon-list"></i></div>
                        <div class="name"><strong class="text-uppercase">Open Cases</strong><span></span>
                            <div class="count-number">{{item.ocases}}</div>
                        </div>
                    </div>
                </div>
                <div class="col-xl-2 col-md-4 col-6">
                    <div class="wrapper count-title d-flex">
                        <div class="icon"><i class="icon-list-1"></i></div>
                        <div class="name"><strong class="text-uppercase">New Cases</strong><span></span>
                            <div class="count-number">{{item.ncases}}</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- Updates Section -->
    <footer class="main-footer">
        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-6">
                    <p>oreorigin.com All rights reserved. &copy; 2017-2019</p>
                </div>
            </div>
        </div>
    </footer>
</div>
<script>
    function go(url) {
        location.href = url;
    }
    let data_column = new Render(".data_column");
    function init() {
        $.ajax({
            url: "/manager/get/get_index",
            success: function (e) {
                let data = {...e,...{ocases: 0, ncases: 0}};
                data_column.obj(data);
            }
        })
    }
    init();
</script>
</body>
</html>